import SnackPart from "./SnackPart.js"
import Track from "./Track.js"
let canvas = document.querySelector("#SnackArea");
let ctx = canvas.getContext('2d');
let btnEl = document.querySelector("#start");
let pauseEl = document.querySelector("#pause");
let headDir = 2; //蛇头方向 0下 1上 2右 3左
let headImg = document.createElement("img");
let footImg = document.createElement("img");
let foodImg = document.createElement("img");
let bodyImg = document.createElement("img");
let snackArr = [new SnackPart(1, 0, headDir, -1), new SnackPart(0, 0, headDir, 0)];
console.log(snackArr);
let trackArr = [];
let toAdd = {};
let speed = 200;
let timer;
let GameScore = 0;
let GameTime = 0;
let GameOver = false;
let foodLocation = {
    x: -1,
    y: -1
};
canvas.width = 600;
canvas.height = 360;
headImg.src = '../image/head.png';
footImg.src = "../image/foot.png";
foodImg.src = "../image/egg.png";
bodyImg.src = "../image/body.png";
btnEl.addEventListener('click', function () {
    start();
});
pauseEl.addEventListener('click', function () {
    pause();
})
headImg.onload = function () {
    footImg.onload = function () {
        bodyImg.onload = function () {
            renderSnack();
        }

    }

}
foodImg.onload = function () {
    createRandomFood();
    renderFood();
}

function renderSnack() {
    let head = snackArr[0];
    let foot = snackArr[snackArr.length - 1];
    ctx.drawImage(headImg, headDir * 40, 0, 40, 40, head.x * 20, head.y * 20, 20, 20);
    ctx.drawImage(footImg, foot.dir * 40, 0, 40, 40, foot.x * 20, foot.y * 20, 20, 20);
    for (let i = 1; i < snackArr.length - 1; i++) {
        let body = snackArr[i];
        ctx.drawImage(bodyImg, 0, 0, 40, 40, body.x * 20, body.y * 20, 20, 20);
    }
}
document.body.onkeydown = function (e) {
    switch (e.keyCode) {
        case 37:
            headDir = 3;
            break;
        case 38:
            headDir = 1;
            break;
        case 39:
            headDir = 2;
            break;
        case 40:
            headDir = 0;
            break;
    }
}

function start() {
    timer = setInterval(internal, speed);
    document.querySelector("#bgmusic").play();
}

function pause() {
    clearInterval(timer);
    timer = -1;
    GameOver = false;
}

function internal() {
    console.log(snackArr);
    if (!GameOver) {
        ctx.clearRect(0, 0, canvas.width, canvas.height);
        move();
        renderSnack();
        renderFood();
        eat();
        out();
        showScore();
        showTime();
    } else {
        pause();
        document.querySelector("#overmusic").play();
        document.querySelector("#bgmusic").pause();
        document.querySelector("#GameOver").style.display = 'block';
    }

}

function move() {
    let head = snackArr[0];
    trackArr.push(new Track(head.x, head.y, headDir));
    switch (headDir) {
        case 0:
            head.y++;
            break;
        case 1:
            head.y--;
            break;
        case 2:
            head.x++;
            break;
        case 3:
            head.x--;
            break;
    }
    let foot = snackArr[snackArr.length - 1];
    toAdd = new SnackPart(foot.x, foot.y, foot.dir, foot.next);
    for (let i = 1; i < snackArr.length; i++) {
        let s = snackArr[i];
        let next = trackArr[s.next];
        s.x = next.x;
        s.y = next.y;
        s.dir = next.dir;
        s.next++;
        // snackArr[i].x = next.x;
        // snackArr[i].y = next.y;
        // snackArr[i].dir = next.dir;
        // snackArr[i].next++;
    }
}

function createRandomFood() {
    let x = parseInt(Math.random() * 30);
    let y = parseInt(Math.random() * 18);
    foodLocation.x = x;
    foodLocation.y = y;
}

function renderFood() {
    ctx.drawImage(foodImg, 0, 0, 40, 40, foodLocation.x * 20, foodLocation.y * 20, 20, 20);
}

function eat() {
    let head = snackArr[0];
    if (head.x === foodLocation.x && head.y === foodLocation.y) {
        createRandomFood();
        snackArr.push(toAdd);
        document.querySelector("#addmusic").play();
        GameScore = parseInt(GameScore) + 1000;
    }
}

function out() {
    let x = snackArr[0].x;
    let y = snackArr[0].y;
    if (x < 0 || x >= 30 || y < 0 || y >= 18) {
        GameOver = true;
        return;
    }
    for (let i = 1; i < snackArr.length; i++) {
        let s = snackArr[i];
        if (x === s.x && y === s.y) {
            GameOver = true;
            return;
        }
    }
}

function showScore() {
    document.querySelector("#GameScore").innerHTML = GameScore;
}

function showTime() {
    GameTime += speed / 1000;
    document.querySelector("#GameTime").innerHTML = parseInt(GameTime);
}
// start();